
import React from "react";
import { Image, List } from "antd-mobile";
import { users } from "./users";
import {  NavBar } from "react-vant";
import { useNavigate } from "react-router-dom";
function Tong() {
  const navigate = useNavigate();
  return (
    <div>
      <div>
        <NavBar onClickLeft={() => navigate(-1)} />
      </div>
      <div onClick={() => navigate("/message")}>
        <List >
          {users.map((user:any) => (
            <List.Item
              key={user.name}
              prefix={
                <Image
                  src={user.avatar}
                  style={{ borderRadius: 20 }}
                  fit="cover"
                  width={40}
                  height={40}
                />
              }
              description={user.description}
            >
              {user.name}
            </List.Item>
          ))}
        </List>
      </div>
    </div>
  );
}

export default Tong;
